/* 初始化 */
*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  list-style-type: none;
  text-decoration: none;
}

.login {
  background: url(../img/lvyou7.jpg) no-repeat;
  background-size: cover;
  /* 头部  头像 */
  .header {
    height: 5.597rem;
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: space-between;
    color: #fff;
    > div {
      width: 94%;
    }
    > div:nth-child(1) {
      height: 1.599rem;
      display: flex;
      justify-content: flex-start;
      font-size: 0.426rem;
      align-items: center;
      >a{
        color: #fff;
      }
    }
    > div:nth-child(2) {
      display: flex;
      flex-flow: column;
      height: 3.731rem;
      justify-content: space-evenly;
      align-items: center;
      >div{
        width: 1.333rem;
        height: 1.333rem;
        background-color: #fff;
        border-radius: 50%;
        img{
          width: 100%;
          height: 100%;
          border-radius: 50%;
          border: none;
        }
      }
      >span{
        font-size: 0.48rem;
      }
      >span:last-child{
        height: 0.533rem;
      }
    }
  }
  /* 账号  密码 */
  .input {
    width: 94%;
    margin: auto;
    height: 4.3rem;
    display: flex;
    flex-flow: column;
    justify-content: space-evenly;
    > div:not(:last-child) {
      height: 1.066rem;
      display: flex;
      align-items: flex-end;
      border-bottom: 0.027rem solid #fff;
      padding-bottom: 0.267rem;
    }
    > div:last-child {
      height: 0.533rem;
      display: flex;
      justify-content: space-between;
      font-size: 0.32rem;
      .show{
        text-align: left;
        height: 0.533rem !important;
        border-bottom: none !important;
        padding-bottom: 0 !important;
        >span{
          color: red;
          font-size: 0.373rem;
          text-align: left;
        }
      }
      > a {
        text-align: right;
        color: #fff;
        font-size: 0.373rem;
      }
    }
    .show{
      text-align: left;
      height: 0.533rem !important;
      border-bottom: none !important;
      padding-bottom: 0 !important;
      >span{
        color: red;
        font-size: 0.373rem;
        text-align: left;
      }
    }
    > div {
      > i {
        color: #fff;
        font-size: 0.666rem;
      }
      > input {
        border: none;
        outline: none;
        width: 70%;
        background-color: transparent;
        padding-left: 0.267rem;
        font-size: 0.453rem;
        color: #fff;
      }
      > input::placeholder {
        color: #fff;
      }
    }
    > div:nth-child(2) {
      > a {
        width: 25%;
        height: 0.933rem;
        color: #fff;
        align-self: flex-end;
        border-radius: 0.133rem;
        border: 0.027rem dotted #00CC99;
        display: flex;
        font-size: 0.373rem;
        justify-content: center;
        align-items: center;
      }
    }
  }
  /* 登录  注册 */
  .denglu {
    width: 100%;
    height: 5rem;
    display: flex;
    flex-flow: column;
    justify-content: space-evenly;
    align-items: center;
    font-size: 0.426rem;
    //  登录按钮
    > input{
      background-color: #00CC99;
      width: 85%;
      border-radius: 0.666rem;
      display: flex;
      justify-content: center;
      align-items: center;
      color: #fff;
      height: 1.333rem;
      border: none;
      outline: none;
      font-size: 0.426rem;
    }
    //  注册按钮
    .reg{
      border: 0.027rem solid #fff;
      background-color: transparent;
      width: 85%;
      border-radius: 0.666rem;
      display: flex;
      justify-content: center;
      align-items: center;
      color: #fff;
      height: 1.333rem;
      font-size: 0.426rem;
    }
    >a:last-child{
      color: #fff;
    }
  }
  /* 第三方 */
  .End {
    height: 2.425rem;
    display: flex;
    align-items: center;
    flex-flow: column;
    justify-content: space-evenly;
    > div {
      color: #ccc;
      width: 80%;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    > div:nth-child(1) {
      height: 0.533rem;
      font-size: 0.373rem;
    }
    > div:nth-child(2) {
      height: 1.066rem;
      > a {
        width: 100%;
        display: flex;
        justify-content: space-evenly;
        align-items: center;
        > i {
          font-size: 1.066rem;
          color: #00CC99;
        }
      }
    }
  }
}
